<template>
	<transition name='fade'>
		<div clsass='pages address'>
			<van-address-edit
			  :area-list="areaList"
			  :address-info="addressInfo"
			  show-postal
			  show-delete
			  show-set-default
			  show-search-result
			  :search-result="searchResult"
			  @save="onSave"
			  @delete="onDelete"
			  @change-detail="onChangeDetail"
			/>
		</div>
	</transition>
</template>

<script>
	import areaList from './area'

	export default{
		data() {
			return {
				areaList 	: areaList,
      			searchResult: [],
      			addressInfo : {}
			}
		},
		computed: {
		 
		},
		created() {
			
		},
		activated() {
			let id = this.$route.query.id

			if(id) {
				this.HttpService.GAddress({id: id}).then(data => {
					let d = data.data
					d.is_default 	 = !!(d.is_default * 1)

					console.log(d)
					this.addressInfo = d
				})
			}
		},
		methods: {	
			onSave(a) {
				let id = this.$route.query.id

				if(id) a.id = id
				this.HttpService.AAddress(a).then(data => {
					if(!data.status) {
						this.addressInfo = {}
						this.$Message.success(data.msg)
					} else {
						this.$Message.error(data.msg)
					}
				})
		    },
		    onDelete() {
		    	let id = this.$route.query.id

				if(!id) {
					this.$Message.success('请问你要删除哪个地址呢?')
					return
				} else {
					this.HttpService.DAddress().then(data => {
			      		if(!data.status) {
			      			this.$Message.success(data.msg)
			      		} else {
			      			this.$Message.error(data.msg)
			      		}
			      	})
				}
		      	
		    },
		    onChangeDetail(val) {
		      if (val) {
		        this.searchResult = [{
		          name: '黄龙万科中心',
		          address: '杭州市西湖区'
		        }];
		      } else {
		        this.searchResult = [];
		      }
		    }
		}
	}
</script>

<style scoped lang="stylus" rel="stylesheet/stylus">
	@import "~@/common/stylus/variable.styl"
	@import "~@/common/stylus/mixin.styl"
	
	::-webkit-scrollbar
		width: 0
	
	
	.loading
		position: fixed
		top: 50px
		bottom: 55px
		left: 0
		right: 0
		z-index: 999
		width: auto
		height: auto
		
		
	
	.move-enter-active, .move-leave-active
		transition:all 0.4s
	.move-enter
		transform: translate3d(100%, 0px, 0)
	.move-leave
		transform: translate3d(0, 0, 0)
		
	.bottom-enter-active, .bottom-leave-active
		transition:all 0.4s cubic-bezier(1.0, 0.5, 0.8, 1.0)
	.bottom-enter
		transform: translate3d(0, 55px, 0)
	.bottom-leave
		transform: translate3d(0, 0px, 0)
</style>